<!-- 分页控件容器 -->
<div class="d-flex align-items-center mt-1 position-relative">
    <!-- 分页信息显示 -->
    <div class="d-flex align-items-center me-3">
        <span class="text-muted small">
            <span class="total-pages">
            共 <span id="total-pages">{{ pagination.total_pages }}</span> 页，
            </span>
            <span id="total-items">{{ pagination.total_items }}</span> 条记录
        </span>
    </div>

    <!-- 分页按钮组 -->
    <div class="btn-group btn-group-sm" role="group" aria-label="分页导航">
        <!-- 上一页按钮 -->
        <button type="button" class="btn btn-outline-primary pagination-btn"
                data-action="prev" {% if pagination.has_prev %}disabled{% endif %}>
            <i class="fas fa-chevron-left"></i>
        </button>

        <!-- 当前页/总页数 -->
        <div class="d-flex align-items-center px-2 current-total">
            <span id="current-page-display">{{ pagination.current_page }}</span>
            <span class="mx-1">/</span>
            <span id="total-pages-display">{{ pagination.total_pages }}</span>
        </div>

        <!-- 下一页按钮 -->
        <button type="button" class="btn btn-outline-primary pagination-btn"
                data-action="next" {% if pagination.has_prev %}disabled{% endif %}>
            <i class="fas fa-chevron-right"></i>
        </button>
    </div>

    <!-- 跳转输入框 -->
    <div class="input-group input-group-sm ms-3">
        <input type="number" class="form-control" id="page-jump-input"
               min="1" max="{{ pagination.total_pages }}"
               placeholder="页码" aria-label="跳转到">
        <button class="btn btn-primary" type="button" id="page-jump-btn">
            <i class="fas fa-arrow-right"></i>
        </button>
    </div>
</div>